<template>
    <sig-main>
        <panel :header="true" title="Register" class="panel-primary panel-4">
            <register :submit="register" :errorMessage="errors" :values="values" :status="status"></register>
        </panel>
    </sig-main>
</template>

<style scoped="">
    .panel-4 {
        width: 400px;
        z-index: 10;
    }
</style>
<script>
    /* eslint-disable no-undef */

    import SigMain from './SigMain.vue';
    import Panel from 'vue-fiu-ui/src/main/js/components/panel/Panel.vue';
    import Register from '../common/user/Register.vue';

    export default {
        components: {
            Register,
            Panel,
            SigMain
        },
        data () {
            return {
                errors: {
                    name: '',
                    email: '',
                    password: '',
                    password_confirmation: ''
                },
                status: this.errors,
                values: this.errors
            };
        },
        methods: {
            register (data) {
                this.initErrors();
                let hasError = this.validator(data);
                this.values = data;
                if (hasError === true) {
                    this.values.password_confirmation = '';
                    return 0;
                }
                axios.post('/user/create', data).then((res) => {
                    if (res.data.success === true) {
                        this.$notify.open({
                            fixed: 'top-right',
                            timeout: 10000,
                            content: '注册成功 3秒后跳转',
                            type: 'success'}
                        );
                        setTimeout(() => {
                            this.$router.push({name: 'Login'});
                        }, 3000);
                    } else {
                        this.$notify.open({
                            fixed: 'top-right',
                            timeout: 10000,
                            content: '注册失败',
                            type: 'warning'});

                        for (let key in res.data.data) {
                            console.info(key, res.data.data[key]);
                            this.errors[key] = res.data.data[key][0];
                        }
                    }
                });
            },
            initErrors () {
                let d = {};
                for (let k in this.errors) {
                    d[k] = '';
                }
                this.errors = d;
            },
            validator (data) {
                let e = false;
                let regName = /^[0-9a-zA-Z]*$/g;
                if (!regName.test(data.name) || data.name.length < 2 || data.name > 12) {
                    e = true;
                    this.errors.name = '用户名必须是字母/数字，并且长度在2-12字节之间';
                }
                let regEmail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
                if (regEmail.test(data.email) === false) {
                    e = true;
                    this.errors.email = '必须是 example@example.com 的格式';
                }
                if (data.password.length < 6 || data.password.length > 32) {
                    e = true;
                    this.errors.password = '密码长度必须在6-32位之间';
                }
                if (data.password !== data.password_confirmation) {
                    e = true;
                    this.errors.password_confirmation = '两次输入的密码不一样';
                }
                return e;
            }
        }
    };
</script>

<style>

</style>
